import React from 'react'
import { Image, Grid } from 'antd-mobile'

export default function GridCom({ servicelist, gotoPath }: any) {
    return (
        <div className='grid-div'>
            <Grid columns={5} gap={8}>
                {servicelist && servicelist.map((item: any) => {
                    return <Grid.Item key={item.id} onClick={() => {
                        gotoPath(item);
                    }}>
                        <div className='grid-main'>
                            <Image src={"/api2" + item.imgUrl}></Image>
                            <p className='servicename'> {item.serviceName}</p>
                        </div>
                    </Grid.Item>
                })}
            </Grid>
        </div>
    )
}
